<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form action="">
        <p>
            颜色选择控件：
            <input type="color">
        </p>
        <p>
            日期选择：
            <input type="date">
        </p>
        <p>
            时间选择：
            <input type="time">
        </p>
        <p>
            电子邮件：
            <input type="email">
        </p>
        <p>
            必填：
            <input type="text" required>
        </p>
        <p>
            数字：
            <input type="number" min="10" max="20">
        </p>
        <p>
            拖拽条：
            <input type="range" min="10" max="20">
        </p>
        <p>
            搜索：
            <input type="search">
        </p>
        <p>
            网址：
            <input type="url">
        </p>
        <p>
            省份：
            <input type="text" list="province-list">
            <datalist id="province-list">
                <option value="山西">
                <option value="山东">
                <option value="广西">
                <option value="广东">
                <option value="湖南">
                <option value="湖北">
                <option value="河南">
                <option value="河北">
            </datalist>
        </p>
        <p>
            <input type="submit" value="提交表单">
        </p>
    </form>
</body>

</html>